<template>
  <div class="stock-box"> 
    <div class="search-box">
        <group>
            <datetime v-model="search_time" :end-date="defult_endTime"></datetime>
        </group> 
    </div> 
    <div class="goods-box">
        <div class="goods-list" v-for="(item,index) in goodsList" :key="index" @click="chooseThis(index)"> 
            <div class="goods-left">
                <img src="" alt="" class="goods-img">
            </div>
            <div class="goods-right">
                <div class="goods-name">{{item.goodsName}}</div>
                <div class="goods-price"><span>单价:</span>￥{{item.price}}</div>
                <div class="goods-num"><span>库存(箱):</span>{{item.num}}</div>
            </div>
         </div>
    </div>
  </div>

</template>

<script>
import row from '@/components/row'
import { Group,Datetime } from 'vux'
import api from '@/api/api.js' 
import util from '@/utils/util.js'
export default { 
  components: {
    row,
    Datetime,
    Group
  },
  data () {
    return { 
        defult_endTime:'',
        search_time:'',
        goodsList:[
            {goodsName:'菌菇鲜虾汤面',price:'12.80',num:'2'},
            {goodsName:'菌菇鲜虾汤面',price:'12.80',num:'2'}
        ], 
    }
  },
  created(){
    this.getAmouthDay()
  },
  mounted () { 
      
  },
  filters: {
     
  },
  methods: {
    // 筛选默认最近一个月
    getAmouthDay(){ 
      let today= new Date();
    //   let mounth_ago =  new Date(today.getTime()-(30*24*60*60*1000)); 
    //   this.starTime = util.timeTampt(mounth_ago);
    //   this.endTime= util.timeTampt(today); 
      this.search_time = util.timeTampt(today); 
      this.defult_endTime = util.timeTampt(today); 
    },
  }
}
</script>
<style lang="less" scoped>
    .search-box{

    }
    /deep/.vux-no-group-title{
        margin-top: 0;
    }
    /deep/.weui-cell{
        justify-content: center;
    }
    /deep/.weui-cell_access .weui-cell__ft{
        flex: initial;
    }
.goods-box{
    padding: 0.24rem;
}
.goods-list{
    display: flex;
    padding: .20rem 0;
    position: relative;
    &::before{
        position: absolute;
        bottom: 0;
        content: '';
        left: 0;
        right: -20px;
        height: 1px;
        background: #f5f5f5;
    }
}

.goods-img{
    width: 1.48rem;
    height: 1.48rem;
    border-radius: .12rem;
    background: #ddd;
}
.goods-name{
    font-size: .30rem;
    font-weight: bold;
    line-height: .34rem;
}
.goods-price,.goods-num{
    
    font-size: .24rem;
    & span{
        margin-right: .12rem;
        color: #999;
    }
}
.goods-right{
    width: 1.48rem;
    height: 1.48rem;
    flex: 1;
    padding-left: .20rem;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.height120{
    height: 60px;
}
.btn{
    text-align: center;
    line-height: 50px;
    background: #FABE00;
    color: #fff;
    height: 50px;
    font-size: 16px;
    letter-spacing: 4px;
    position: fixed;
    width: 100%;
    bottom: 0;
    left: 0;
}
</style>